import React from 'react'
import MileageDataFilter from "../../components/Report/MileageDataFilter";
import MileageDataTable from "../../components/Report/MileageDataTable";
import {Card} from "antd";
import PageHeaderWrapper from '@/components/PageHeaderWrapper';
import {fetchMileageReportData} from "../../services/report";
import {getTimeDistance} from "../../utils/utils";
import {connect} from "react-redux";

// Mileage page  4 (明细/日报/周报/月报)
class Mileage extends React.Component {
  state = {
    type: 'day',
    reportData: [],
    loading: false,
  };

  handleFetchReportData = async (params) => {
    this.setState({loading: true, type: params.type});
    const reportData = await fetchMileageReportData(params);
    this.setState({reportData: reportData.data, loading: false,});
  };

  render() {
    return (
      <div>
        <PageHeaderWrapper title="里程报表">
          <Card bordered={false}>
            <MileageDataFilter onFetch={this.handleFetchReportData}/>
            <MileageDataTable reportData={this.state.reportData} loading={this.state.loading} type={this.state.type}/>
          </Card>
        </PageHeaderWrapper>
      </div>
    )
  }
}


export default Mileage;
